
.card-enter,.card-appear{
    opacity: 0;
    transform:scale(.4);
}
.card-enter-active,.card-appear-active{
    opacity: 1;
    transform: scale(1);
    transition: opacity 300ms,transform 300ms;
}
.card-exit{
    opacity: 1;
    transform: scale(1);
}
.card-exit-active{
    opacity: 0;
    transform: scale(0.4);
    transition: opacity 300ms,transform 300ms;
}
.card-exit-done{
    opacity: 0;
}
.boxtrans{
    width: 100px;
    height: 100px;
    border: 2px solid red;
    transition: 3s all linear;
}
.boxtrans:hover {
    transition-duration: .5s; 
    border: 2px solid blue;
}
